import 'package:flutter/material.dart';
import 'package:flutter/scheduler.dart';

class BreathePage extends StatefulWidget {
  const BreathePage({Key? key}) : super(key: key);

  @override
  _BreathePageState createState() => _BreathePageState();
}

class _BreathePageState extends State<BreathePage>
    with TickerProviderStateMixin {
  late final AnimationController _controller;
  late final AnimationController _scalecontroller;

  @override
  void initState() {
    _controller = AnimationController(
      vsync: this,
    );
    _scalecontroller = AnimationController(
      duration: Duration(milliseconds: 1750),
      vsync: this,
    );
    init();

    super.initState();
  }

  init() async {
    // timeDilation = 5;// 放慢
    _controller.duration = Duration(seconds: 4);
    _controller.forward();
    await Future.delayed(Duration(seconds: 4));
    _scalecontroller.repeat(reverse: true);
    await Future.delayed(Duration(seconds: 7));
    _scalecontroller.stop();
    _controller.duration = Duration(seconds: 8);
    _controller.reverse();
  }

  @override
  void dispose() {
    _controller.dispose();
    _scalecontroller.dispose();
    super.dispose();
  }

  @override
  Widget build(BuildContext context) {
    // 交错动画
    // Animation animation1 = Tween(begin: 0.0, end: 1)
    //     .chain(CurveTween(curve: Interval(0, 0.2)))
    //     .animate(_controller);
    // Animation animation2 = Tween(begin: 1.0, end: 0.0)
    //     .chain(CurveTween(curve: Interval(0.4, 0.95)))
    //     .animate(_controller);

    return Scaffold(
      appBar: AppBar(title: const Text('呼吸动画')),
      body: Center(
        child: ScaleTransition(
          scale: Tween<double>(begin: 1, end: 1.3)
              .chain(CurveTween(curve: Curves.easeIn))
              .animate(_scalecontroller),
          child: AnimatedBuilder(
            animation: _controller,
            builder: (context, child) {
              return Container(
                width: 300,
                height: 300,
                decoration: BoxDecoration(
                    shape: BoxShape.circle,
                    gradient: RadialGradient(
                        colors: [
                          Colors.blue[600]!,
                          Colors.blue[100]!,
                        ],
                        // 交错动画
                        stops: [
                          _controller.value,
                          _controller.value + 0.1
                        ])),
              );
            },
          ),
        ),
      ),
    );
  }
}
